<template lang="html">
  <div class="container">

  <home-header></home-header>

    <div class="comment">
      <ul class="cont_ul">
        <list v-for="item in items" :key="item.id" :price="item.price" :title="item.title" :img="item.img"></list>
      </ul>
    </div>
  <common-footer></common-footer>
  </div>
</template>

<script>
import HomeHeader from '../components/header'
import CommonFooter from '../components/footer'
import List from '../components/list'

export default {
  data() {
    return{
      items: []/* 定义一个空数组数据items */
    }
  },
  components: {
  HomeHeader,
  CommonFooter,
  List
},
created () {
    this.$http.get('/api/goods').then((data) => {
    this.items = data.body.data;
    })
}
}
</script>

<style lang="css">
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
</style>
